﻿<?xml version="1.0" encoding="utf-8"?><Articles><Article><ArticlesID>914</ArticlesID><Title>Ứng dụng Firebug v&amp;#224;o việc tăng tốc website</Title><Body>&amp;lt;p&amp;gt;Trong b&amp;amp;agrave;i n&amp;amp;agrave;y m&amp;amp;igrave;nh sẽ n&amp;amp;oacute;i về phần ứng dụng Firebug để tăng tốc độ website của bạn.&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
Đầu  ti&amp;amp;ecirc;n c&amp;amp;aacute;c bạn xem h&amp;amp;igrave;nh dưới đ&amp;amp;acirc;y:&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
&amp;lt;img width=&amp;quot;800&amp;quot; height=&amp;quot;461&amp;quot; border=&amp;quot;0&amp;quot; src=&amp;quot;http://up.meotom.net/Files/c654ffd5-a845-4b0b-83d4-02f968d0647a/2010/05/03/800x0__201005032034394416____firebug.gif&amp;quot; alt=&amp;quot;Ứng dụng Firebug v&amp;amp;agrave;o việc tăng tốc website&amp;quot; /&amp;gt;&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
&amp;lt;b&amp;gt;Bạn c&amp;amp;oacute; nhận x&amp;amp;eacute;t g&amp;amp;igrave; khi  nh&amp;amp;igrave;n xong h&amp;amp;igrave;nh tr&amp;amp;ecirc;n? &amp;lt;/b&amp;gt;&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
Tab NET của Firebug cho bạn th&amp;amp;ocirc;ng số loading của c&amp;amp;aacute;c th&amp;amp;agrave;nh phần  trong trang web của bạn.&amp;lt;br /&amp;gt;
1. C&amp;amp;aacute;c status 200 (c&amp;amp;oacute; reponse), 404 (can't  not found)....&amp;lt;br /&amp;gt;
2. Thời gian load: thời gian một đối tượng load xuống  browser.&amp;lt;br /&amp;gt;
3. Dung lượng load: Phần n&amp;amp;agrave;y nếu bạn thấy dấu ? v&amp;amp;agrave; status  200 nghĩa l&amp;amp;agrave; c&amp;amp;oacute; reponse nhưng l&amp;amp;agrave; response sai kết quả.&amp;lt;br /&amp;gt;
4. Thứ tự  load: Phần n&amp;amp;agrave;y kh&amp;amp;aacute; quan trọng v&amp;amp;agrave; m&amp;amp;igrave;nh sẽ tr&amp;amp;igrave;nh b&amp;amp;agrave;y tiếp theo sau đ&amp;amp;acirc;y.&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
Sở  dĩ m&amp;amp;igrave;nh cho phần #4 l&amp;amp;agrave; quan trọng bởi v&amp;amp;igrave; c&amp;amp;aacute;c phần kia th&amp;amp;igrave; hầu như mọi  người đều biết c&amp;amp;aacute;ch khắc phục m&amp;amp;agrave; kh&amp;amp;ocirc;ng cần kinh nghiệm nhiều.&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
1.  Giả sử site của bạn bị status not found th&amp;amp;igrave; bạn chỉ cần  cập nhật lại  link hoặc bỏ đi để tăng tốc độ website thay v&amp;amp;igrave; bắt browser phải search request l&amp;amp;ecirc;n  server mất kh&amp;amp;aacute; nhiều tời gian.&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
2. Về thời gian v&amp;amp;agrave; dung lượng:  muốn tăng tốc th&amp;amp;igrave; bạn chỉ cần optimize h&amp;amp;igrave;nh, Javascript, CSS  cho dung lượng tối thiểu m&amp;amp;atilde; vẫn đầy đủ chức năng.&amp;lt;br /&amp;gt;
- Th&amp;amp;ocirc;ng thường nếu  d&amp;amp;ugrave;ng h&amp;amp;igrave;nh jpg th&amp;amp;igrave; m&amp;amp;igrave;nh thường để resolution 60 hoặc 70 t&amp;amp;ugrave;y theo chất  lượng ảnh, cũng c&amp;amp;oacute; thể tăng th&amp;amp;ecirc;m 1 &amp;amp;iacute;t, nếu bạn c&amp;amp;oacute; kinh nghiệm về  Photoshop sẽ tự biết phải l&amp;amp;agrave;m g&amp;amp;igrave; với n&amp;amp;oacute;.&amp;lt;br /&amp;gt;
- Javascript v&amp;amp;agrave; CSS  th&amp;amp;igrave; để giảm dung lượng th&amp;amp;igrave; sau khi code xong bạn chỉ cần cho tất cả l&amp;amp;ecirc;n  th&amp;amp;agrave;nh 1 d&amp;amp;ograve;ng trước khi upload l&amp;amp;ecirc;n server.&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
3. Về thứ tự th&amp;amp;igrave; chắc  một số người c&amp;amp;oacute; kinh nghiệm v&amp;amp;agrave; để &amp;amp;yacute; th&amp;amp;igrave; c&amp;amp;oacute; thể biết, tuy nhi&amp;amp;ecirc;n m&amp;amp;igrave;nh nghĩ  đa phần c&amp;amp;aacute;c bạn thiết kế web chắc chẳng quan t&amp;amp;acirc;m đến c&amp;amp;aacute;i n&amp;amp;agrave;y.&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
Thực  ra c&amp;amp;aacute;i n&amp;amp;agrave;y rất quan trọng trong việc tăng tốc độ website của bạn. C&amp;amp;aacute;c  bạn cũng thấy c&amp;amp;aacute;c th&amp;amp;agrave;nh phần được load theo h&amp;amp;igrave;nh bậc thang kh&amp;amp;ocirc;ng đều.  C&amp;amp;aacute;c th&amp;amp;agrave;nh phần c&amp;amp;oacute; điểm load bắt đầu bằng nhau th&amp;amp;igrave; tức l&amp;amp;agrave; đang được load  c&amp;amp;ugrave;ng l&amp;amp;uacute;c. C&amp;amp;aacute;c th&amp;amp;agrave;nh phần load sau v&amp;amp;agrave; thụt v&amp;amp;agrave;o tức l&amp;amp;agrave; n&amp;amp;oacute; phải chờ th&amp;amp;agrave;nh  phần trước. Điển h&amp;amp;igrave;nh như h&amp;amp;igrave;nh tr&amp;amp;ecirc;n:&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
- Th&amp;amp;agrave;nh phần GET  Firebug-cong-cu-huu-ich... được load đầu ti&amp;amp;ecirc;n, điều n&amp;amp;agrave;y l&amp;amp;agrave; hiển nhi&amp;amp;ecirc;n v&amp;amp;igrave;  trang html của bạn lu&amp;amp;ocirc;n được gọi đầu ti&amp;amp;ecirc;n. Tất yếu c&amp;amp;aacute;c  th&amp;amp;agrave;nh phần sau n&amp;amp;oacute; phải chờ n&amp;amp;oacute;.&amp;lt;br /&amp;gt;
- Cũng v&amp;amp;igrave; vậy m&amp;amp;agrave; bạn thấy css_6 được  load sau v&amp;amp;agrave; thụt v&amp;amp;agrave;o ph&amp;amp;iacute;a sau, tức l&amp;amp;agrave; phải chờ trang html  load xong browser mới nhận biết được html  đ&amp;amp;oacute; gọi những file g&amp;amp;igrave;.&amp;lt;br /&amp;gt;
- Sau CSS  l&amp;amp;agrave; đến c&amp;amp;aacute;c h&amp;amp;igrave;nh ảnh được gọi từ file CSS.  Nếu c&amp;amp;aacute;c bạn để &amp;amp;yacute; kỹ th&amp;amp;igrave; sẽ thấy rằng khi kiểu file (đu&amp;amp;ocirc;i file bị thay  đổi) sẽ g&amp;amp;acirc;y n&amp;amp;ecirc;n t&amp;amp;igrave;nh trạng chờ, tức bị thụt v&amp;amp;agrave;o. &amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
&amp;lt;b&amp;gt;Vậy l&amp;amp;agrave;m sao  để tr&amp;amp;aacute;nh t&amp;amp;igrave;nh trạng bậc thang c&amp;amp;agrave;ng &amp;amp;iacute;t c&amp;amp;agrave;ng tốt?&amp;lt;/b&amp;gt;&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
Qua phần m&amp;amp;ocirc; tả  tr&amp;amp;ecirc;n th&amp;amp;igrave; chắc c&amp;amp;aacute;c bạn cũng đ&amp;amp;atilde; hiểu m&amp;amp;igrave;nh cần l&amp;amp;agrave;m g&amp;amp;igrave;.&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
1. Khi d&amp;amp;ugrave;ng h&amp;amp;igrave;nh  cho website hạn chế  tối đa d&amp;amp;ugrave;ng nhiều kiểu file h&amp;amp;igrave;nh.&amp;lt;br /&amp;gt;
2. Tận dụng tối đa CSS  để đặt h&amp;amp;igrave;nh v&amp;amp;agrave;o m&amp;amp;agrave; kh&amp;amp;ocirc;ng n&amp;amp;ecirc;n gọi từ thuộc t&amp;amp;iacute;nh style của thẻ html.&amp;lt;br /&amp;gt;
3.  Theo lời khuy&amp;amp;ecirc;n của c&amp;amp;aacute;c chuy&amp;amp;ecirc;n gia Yahoo về tăng tốc web th&amp;amp;igrave; n&amp;amp;ecirc;n đặt CSS  l&amp;amp;ecirc;n đầu v&amp;amp;agrave; Javascript xuống dưới cuối c&amp;amp;ugrave;ng. &amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
Về Javascript th&amp;amp;igrave; ngoại trừ trường hợp bất khả kh&amp;amp;aacute;ng  mới đặt đ&amp;amp;uacute;ng vị tr&amp;amp;iacute; trong html.  Bởi v&amp;amp;igrave; c&amp;amp;oacute; một số trường hợp bạn đặt dưới c&amp;amp;ugrave;ng th&amp;amp;igrave; sẽ bị undefine c&amp;amp;aacute;c  variable v&amp;amp;agrave; function. Th&amp;amp;ocirc;ng thường th&amp;amp;igrave; c&amp;amp;aacute;c Javascript chỉ được gọi dựa v&amp;amp;agrave;o sự kiện người d&amp;amp;ugrave;ng  n&amp;amp;ecirc;n đặt ph&amp;amp;iacute;a dưới, điều n&amp;amp;agrave;y tạo cảm gi&amp;amp;aacute;c cho người d&amp;amp;ugrave;ng website của bạn nhanh.  Website của bạn c&amp;amp;oacute;  thể bật l&amp;amp;ecirc;n nhanh ch&amp;amp;oacute;ng v&amp;amp;agrave; Javascript sẽ load ngầm sau đ&amp;amp;oacute;.&amp;lt;br /&amp;gt;
&amp;lt;br /&amp;gt;
Hoặc bạn cũng c&amp;amp;oacute; thể v&amp;amp;agrave;o trang  chủ sau đ&amp;amp;oacute; bấm v&amp;amp;agrave;o một chủ đề bất kỳ. Bạn sẽ thấy chỉ c&amp;amp;aacute;c th&amp;amp;agrave;nh phần  kh&amp;amp;aacute;c nhau giữa c&amp;amp;aacute;c trang thay đổi. Nếu bạn refresh tại chỗ th&amp;amp;igrave; thấy hầu  như trang web xuất hện lại lập tức m&amp;amp;agrave; kh&amp;amp;ocirc;ng bị giật trang.&amp;lt;/p&amp;gt;
&amp;lt;p style=&amp;quot;text-align: right;&amp;quot;&amp;gt;&amp;lt;em&amp;gt;Sưu tầm&amp;lt;/em&amp;gt;&amp;lt;/p&amp;gt;</Body><CommentEnabled>True</CommentEnabled><ViewCount>0</ViewCount><ReleaseDate>5/16/2010 8:30:54 AM</ReleaseDate><TotalComment>0</TotalComment><IsMedia>False</IsMedia><IsPicture>False</IsPicture><IsVote>True</IsVote><ArticlePassword /><PostVisible>0</PostVisible><ArticlePath>/2010/5/3/Ung-dung-Firebug-vao-viec-tang-toc-website-392</ArticlePath><Approved>True</Approved><ImagePath /><CategoryId>44</CategoryId><ArrayCatID>44|34</ArrayCatID></Article></Articles>